import 'package:safetymonitor/app/core/core.dart';
import 'package:safetymonitor/app/core/ext/ext.dart';

/// 自定义两个选项复选框容器(自定义CustomCheckbox 模块化)---2数量----唯一
/// [choice1Text] 复1
/// [choice2Text] 复2
/// [choice1TextColor] 复2 style
/// [choice2TextColor] 复2 style
/// [onChoice1Changed] 选中后的回调 value true选中  false未选中
/// [checkboxBuilder] 模块化-在外面构建(自定义)复选框 isSelected设置是否选中  onChanged  CustomCheckbox（任何widget）的点击回调=》_onChoiceChanged
/// demo:
/// CustomTwoChoiceCheckbox(
///         choice1Text: 'XXX',
///         choice2Text: 'XXX',
///         choice1TextColor: TextStyle(
///           fontSize: 14.sp,
///           fontWeight: FontWeight.w400,
///           color: const Color(0xFF8D95A3),
///         ),
///         choice2TextColor: TextStyle(
///           fontSize: 14.sp,
///           fontWeight: FontWeight.w400,
///           color: const Color(0xFF8D95A3),
///         ),
///         initialChoice1: initialChoice1,
///         initialChoice2: initialChoice2,
///         onChoice1Changed: (bool value) {
///           AppToast.showSuccess('1$value');
///         },
///         onChoice2Changed: (bool value) {
///           AppToast.showSuccess('2$value');
///         },
///         checkboxBuilder: (isSelected, onChanged) {
///           return CustomCheckbox(
///             isChecked: isSelected,
///             onChanged: (bool? newValue) => onChanged(),
///           );
///         },
///       )
class CustomTwoChoiceCheckbox extends StatefulWidget {
  const CustomTwoChoiceCheckbox({
    required this.choice1Text,
    required this.choice1TextColor,
    required this.choice2Text,
    required this.choice2TextColor,
    required this.onChoice1Changed,
    required this.onChoice2Changed,
    required this.checkboxBuilder,
    this.initialChoice1 = false,
    this.initialChoice2 = false,
    this.enabled = true,
    super.key,
  });

  ///设置不可编辑;
  final bool enabled;
  final String choice1Text;
  final TextStyle choice1TextColor;
  final String choice2Text;
  final TextStyle choice2TextColor;
  final bool initialChoice1;
  final bool initialChoice2;
  final ValueChanged<bool> onChoice1Changed;
  final ValueChanged<bool> onChoice2Changed;
  final Widget Function(bool isSelected, VoidCallback onChanged) checkboxBuilder;

  @override
  CustomTwoChoiceCheckboxState createState() => CustomTwoChoiceCheckboxState();
}

class CustomTwoChoiceCheckboxState extends State<CustomTwoChoiceCheckbox> {
  late bool _isSelected1;
  late bool _isSelected2;

  @override
  void initState() {
    super.initState();
    _isSelected1 = widget.initialChoice1;
    _isSelected2 = widget.initialChoice2;
  }

  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisSize: MainAxisSize.min,
      children: <Widget>[
        Row(
          children: [
            widget.checkboxBuilder(_isSelected1, () => _onChoiceChanged(1)),
            AppGaps.hGap6,
            Text(
              widget.choice1Text,
              style: widget.choice1TextColor,
            ),
          ],
        ).clickOnce(() {
          widget.enabled ? _onChoiceChanged(1) : null;
        }),
        AppGaps.hGap20,
        Row(
          children: [
            widget.checkboxBuilder(_isSelected2, () => _onChoiceChanged(2)),
            AppGaps.hGap6,
            Text(
              widget.choice2Text,
              style: widget.choice2TextColor,
            ),
          ],
        ).clickOnce(() {
          widget.enabled ? _onChoiceChanged(2) : null;
        }),
      ],
    );
  }

  void _onChoiceChanged(int choiceNumber) {
    setState(() {
      if (choiceNumber == 1) {
        if (_isSelected1) {
          return;
        }
        _isSelected1 = !_isSelected1;
        if (_isSelected1) _isSelected2 = false;
        widget.onChoice1Changed(_isSelected1);
      } else {
        if (_isSelected2) {
          return;
        }
        _isSelected2 = !_isSelected2;
        if (_isSelected2) _isSelected1 = false;
        widget.onChoice2Changed(_isSelected1);
      }
    });
  }
}
